<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title langWord="t:index_Product"></title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" href="../../resources/css/mui.css">
    <link rel="stylesheet" href="../../resources/css/style.css">
    <link rel="stylesheet" href="../../resources/css/product/category.css">
    <script src="../../resources/assets/mui.js"></script>
    <script src="../../resources/assets/avalon.js"></script>
    <script src="../../resources/assets/jquery-2.0.3.min.js"></script>
    <script src="../../resources/js/lang/en.js"></script>
    <script src="../../resources/js/dahua.config.js"></script>
    <script src="../../resources/js/common.js"></script>
    <script src="../../resources/js/product/category.js"></script>

</head>

<body ms-controller="categoryPage">

    <input type="hidden" value="" id="uid" />
    <!--头部-->
    <header class="mui-bar mui-bar-nav header">
        <a class="mui-icon mui-pull-left mui-icon-white ml5" href="search.html">
            <i class="icon icon_search"></i>
        </a>
        <h1 id="title" class="mui-title"><img src="../../resources/images/logo.png"></h1>
        <a class="mui-icon mui-pull-right mui-icon-white mr5" href="../product/listtest.html" id="to">
            <!-- <a class="mui-icon mui-pull-right mui-icon-white mr5" href="../product/productslist.html"> -->
            <i class="icon icon_filter"></i>
        </a>
    </header>

    <div id="category" class="mui-content mui-scroll-wrapper whitebg">
        <div class="mui-scroll">
            <!--图片滚动-->
            <div id="slider" class="mui-slider" style="z-index: 99999;" ms-class="{'mui-hidden': (true == @isBannerEmpty)}">
                <div class="mui-slider-group mui-slider-loop">

                    <!-- 额外增加的一个节点(循环轮播：第一个节点是最后一张轮播) -->
                    <div class="mui-slider-item mui-slider-item-duplicate">
                        <a href="pdp.html" ms-attr="{'data-id':@banners.last.linkUrl,'data-type':@banners.last.linkType}">
                            <img ms-attr="{src: @banners.last.path}" class="sliderImg">
                        </a>
                    </div>

                    <div class="mui-slider-item" ms-for='(i,banner) in @banners.items'>
                        <a href="pdp.html" ms-attr="{'data-id':@banner.linkUrl,'data-type':@banner.linkType}">
                            <img ms-attr="{src: @banner.path}" class="sliderImg">
                        </a>
                    </div>

                    <!-- 额外增加的一个节点(循环轮播：最后一个节点是第一张轮播) -->
                    <div class="mui-slider-item mui-slider-item-duplicate">
                        <a href="pdp.html" ms-attr="{'data-id':@banners.first.linkUrl,'data-type':@banners.first.linkType}">
                            <img ms-attr="{src: @banners.first.path}" class="sliderImg">
                        </a>
                    </div>
                </div>
            </div>

            <!--商品类目-->
            <div class="mui-row categoryImg" ms-class="{'mui-hidden':@categorys.length==0}">
                <div class="mui-col-xs-12 product_box ">
                    <div class="mui-col-xs-6 mui-table" ms-for='(i,category) in @categorys'>
                        <a class="mui-table-cell vm" ms-attr="{href:'allproducts.html',id:@category.id,index:@i}">
                            <img ms-class="{'mui-hidden': (null == @category.image)}" ms-attr="{src: @category.image}">
                            <p class="category-name" ms-html="@category.name"></p>
                        </a>
                    </div>
                </div>
                <div class="mui-col-xs-12 for-more" ms-class="{'mui-hidden': (0 == @newRows)}">
                    <span class="mui-badge">
                        <a href="allproducts.html" class="font-white">
                            <i class="icon icon_more"></i><span langWord="t:Product_Product_Category"></span>
                        </a>
                    </span>
                </div>
            </div>


        </div>
    </div>

    <!-- <div class="mui-popover mui-popover-action mui-popover-bottom" ms-for='(i,category) in @categorys' ms-attr="{id: 'category_'+@category.id}">
        <ul class="mui-table-view category-list">
            <li class="mui-table-view-cell" ms-for='(i,child) in @category.childs'>
                <a ms-attr="{href: 'list.html?cid='+@child.id}">{child.name}</a>
            </li>
        </ul>
        <ul class="mui-table-view">
            <li class="mui-table-view-cell">
                <a ms-attr="{href: '#category_'+@category.id}">Cancel</a>
            </li>
        </ul> -->
    </div>


    <!--底部导航-->
    <footer class="mui-bar mui-bar-tab footer">
        <a id="defaultTab" data-id="1" class="mui-tab-item mui-active" href="category.html">
            <span class="mui-icon icon icon_product active"></span>
            <span class="mui-tab-label" langWord="t:index_Product"></span>
        </a>
        <a class="mui-tab-item" href="../solution/category.html">
            <span class="mui-icon icon icon_solution"></span>
            <span class="mui-tab-label" langWord="t:index_Solution"></span>
        </a>
        <a id="partner" class="mui-tab-item mui-hidden" href="../partner/index.html">
            <span class="mui-icon icon icon_partner"></span>
            <span class="mui-tab-label" langWord="t:index_Partner"></span>
        </a>
        <a class="mui-tab-item" href="../user/user.html">
            <span class="mui-icon icon icon_usercenter"></span>
            <span class="mui-tab-label" langWord="t:index_User_Center"></span>
        </a>
    </footer>

</body>

</html>
